import React from 'react';
import { Row, Col, message, Table, Tooltip, Button } from 'antd';
import Modal from '../../../../../../components/Modal';

export const getEnterColumns = () => [
  {
    dataIndex: 'name',
    title: '参数名',
  },
  {
    dataIndex: 'positionLabel',
    title: '参数位置',
  },
  {
    dataIndex: 'typeLabel',
    title: '类型',
  },
  {
    dataIndex: 'nonEmptyLabel',
    title: '必填',
  },
  {
    dataIndex: 'desc',
    title: '描述',
  },
  {
    dataIndex: 'thirdParamList.name',
    title: '对应参数名',
    render: (_, { thirdParamList }) =>
      thirdParamList && thirdParamList.map((item, index) => <p key={index}>{item.name}</p>),
  },
  {
    dataIndex: 'thirdParamList.positionLabel',
    title: '对应参数位置',
    render: (_, { thirdParamList }) =>
      thirdParamList && thirdParamList.map((item, index) => <p key={index}>{item.positionLabel}</p>),
  },
  {
    dataIndex: 'thirdParamList.typeLabel',
    title: '对应参数类型',
    render: (_, { thirdParamList }) =>
      thirdParamList && thirdParamList.map((item, index) => <p key={index}>{item.typeLabel}</p>),
  },
  {
    dataIndex: 'action',
    title: '操作',
    render: (_, record) => (
      <Button type='text' onClick={() => handleMore(record)}>
        更多
      </Button>
    ),
  },
];

const getMoreList = (data) => [
  {
    label: '参数名',
    value: data.name,
  },
  {
    label: '参数位置',
    value: data.positionLabel,
  },
  {
    label: '参数类型',
    value: data.typeLabel,
  },
  {
    label: '默认值',
    value: data.defaultVal,
  },
  {
    label: '示例',
    value: data.example,
  },
  {
    label: '最大长度',
    value: data.maxLength,
  },
  {
    label: '枚举',
    value: data.enums,
  },
  {
    label: '参数验证',
    value: data.regExp,
  },
];

const handleMore = (record) => {
  const moreList = getMoreList(record);
  Modal.open({
    title: '更多',
    width: '500px',
    content: (
      <Row>
        {moreList.map(({ label, value }) => (
          <Col key={label} span={24} style={{ marginBottom: '20px' }}>
            <Row>
              <Col span={6}>{label}</Col>
              <Col span={18} style={{ color: 'rgba(114,123,141,1)' }}>
                {value || '-'}
              </Col>
            </Row>
          </Col>
        ))}
      </Row>
    ),
    isOkBtn: false,
    maskClosable: false,
    isCancelBtn: false,
  });
};

export const getMapColumns = (value) => [
  {
    title: '源key',
    dataIndex: 'thirdPath',
    width: 200,
    ellipsis: true,
    render: (text) => (
      <div style={{ wordWrap: 'break-word', wordBreak: 'break-word' }}>
        <Tooltip title={text} placement='topLeft'>
          {text}
        </Tooltip>
      </div>
    ),
  },
  {
    title: '映射key',
    dataIndex: 'innerPath',
    width: 200,
    ellipsis: true,
    render: (text) => (
      <div style={{ wordWrap: 'break-word', wordBreak: 'break-word' }}>
        <Tooltip title={text} placement='topLeft'>
          {text}
        </Tooltip>
      </div>
    ),
  },
  {
    title: '数据类型',
    dataIndex: 'typeLabel',
  },
  {
    title: '返回key(是否)',
    dataIndex: 'isReturningLabel',
  },
  {
    title: '操作',
    dataIndex: 'action',
    render: (_, record) => (
      <Button type='link' onClick={() => handleMap(record, value.codeMaps)}>
        码值映射
      </Button>
    ),
  },
];

const codeColumns = [
  {
    title: '源key',
    dataIndex: 'srcKey',
  },
  {
    title: '码值',
    dataIndex: 'srcCode',
  },
  {
    title: '映射key',
    dataIndex: 'destKey',
  },
  {
    title: '码值',
    dataIndex: 'destCode',
  },
  {
    title: '描述',
    dataIndex: 'destDesc',
  },
];

const handleMap = ({ thirdPath }, codeMaps) => {
  const mapData = codeMaps.filter((item) => item.srcKey === thirdPath);
  if (!mapData.length) return message.warning('没有码值映射');
  Modal.open({
    title: '更多',
    width: '500px',
    content: <Table rowKey='id' columns={codeColumns} dataSource={mapData} pagination={false} />,
    isOkBtn: false,
    maskClosable: false,
    isCancelBtn: false,
  });
};

export const getCostColumns = () => [
  {
    title: '数据源计费参数名',
    dataIndex: '',
    render: (_, { thirdFeeRuleList }) =>
      thirdFeeRuleList &&
      thirdFeeRuleList.map(({ name, id, linkPrevType }) => (
        <div key={id} style={linkPrevType === 0 ? { paddingBottom: '15px' } : {}}>
          {name}
        </div>
      )),
  },
  {
    title: '码值',
    render: (_, { thirdFeeRuleList }) =>
      thirdFeeRuleList &&
      thirdFeeRuleList.map(({ code, id, linkPrevType }) => (
        <div key={id} style={linkPrevType === 0 ? { paddingBottom: '15px' } : {}}>
          {code}
        </div>
      )),
  },
  {
    title: '计费类型',
    render: (_, { thirdFeeRuleList }) =>
      thirdFeeRuleList &&
      thirdFeeRuleList.map(({ feeRuleTypeLabel, id, linkPrevType }) => (
        <div key={id} style={linkPrevType === 0 ? { paddingBottom: '15px' } : {}}>
          {feeRuleTypeLabel}
        </div>
      )),
  },
  {
    dataIndex: 'name',
    title: '接口计费参数名',
  },
  {
    dataIndex: 'code',
    title: '码值',
  },
  {
    dataIndex: 'feeRuleTypeLabel',
    title: '计费类型',
  },
];

export const getSereviceInfoList = (data) => [
  {
    label: '供应商',
    value: data.supplierName,
  },
  {
    label: 'ID',
    value: data.id,
  },
  {
    label: '数据源',
    value: data.name,
  },
  {
    label: '数据接口地址',
    value: data.serviceUrl,
  },
  {
    label: '数据源类型',
    value: data.groupIdLabel,
  },
  {
    label: 'HTTP Method',
    value: data.httpMethodLabel,
  },
  {
    label: '调用失败次数',
    value: `${data.timesLimit} 次`,
  },
  {
    label: '计费方式',
    value: data.feeTypeLabel,
  },
  {
    label: '扩展文件',
    value: data.encryptFileName,
  },
  {
    label: '数据源描述',
    value: data.desc,
  },
];

export const getConstantColumns = () => [
  {
    title: '数据源参数名',
    dataIndex: 'name',
  },
  {
    title: '数据源参数位置',
    dataIndex: 'positionLabel',
  },
  {
    title: '类型',
    dataIndex: 'typeLabel',
  },
  {
    title: '参数值',
    dataIndex: 'val',
  },
];
